.bottomr {
    position: sticky;
    left: 0;
    bottom: 0;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    background: #fff;
}

.bottomr label {
    width: 25%;
    height: 11rem;
}

.bottomr label .box {
    width: 100%;
}

.bottomr .label1 .box .text {
    text-align: center;
    width: 100%;
    height: 11rem;
    line-height: 18rem;
    background: url(../images/bottom1.png) no-repeat center 2rem;
    background-size: 30%;
    font-size: 2rem;
    color: #a3a3a3;
}

.bottomr .label2 .box .text {
    text-align: center;
    width: 100%;
    height: 11rem;
    line-height: 18rem;
    background: url(../images/bottom2.png) no-repeat center 2rem;
    background-size: 30%;
    font-size: 2rem;
    color: #a3a3a3;
}

.bottomr .label3 .box .text {
    text-align: center;
    width: 100%;
    height: 11rem;
    line-height: 18rem;
    background: url(../images/bottom3.png) no-repeat center 2rem;
    background-size: 30%;
    font-size: 2rem;
    color: #a3a3a3;
}

.bottomr .label4 .box .text {
    text-align: center;
    width: 100%;
    height: 11rem;
    line-height: 18rem;
    background: url(../images/bottom4.png) no-repeat center 2rem;
    background-size: 30%;
    font-size: 2rem;
    color: #a3a3a3;
}

.bottomr .label5 .box .text {
    text-align: center;
    width: 100%;
    height: 11rem;
    line-height: 18rem;
    background: url(../images/bottom5.png) no-repeat center 2rem;
    background-size: 30%;
    font-size: 2rem;
    color: #a3a3a3;
}

#ck1:checked+label .box .text {
    text-align: center;
    width: 100%;
    height: 11rem;
    line-height: 18rem;
    background: url(../images/bottom1-1.png) no-repeat center 2rem;
    background-size: 30%;
    font-size: 2rem;
    color: #a3a3a3;
}

#ck2:checked+label .box .text {
    background: url(../images/bottom2-1.png) no-repeat center 2rem;
    color: #4f3cb1;
    background-size: 30%;
}

#ck3:checked+label .box .text {
    background: url(../images/bottom3-1.png) no-repeat center 2rem;
    color: #4f3cb1;
    background-size: 30%;
}

#ck4:checked+label .box .text {
    background: url(../images/bottom4-1.png) no-repeat center 2rem;
    color: #4f3cb1;
    background-size: 30%;
}

#ck5:checked+label .box .text {
    background: url(../images/bottom5-1.png.) no-repeat center 2rem;
    color: #4f3cb1;
    background-size: 30%;

}

/* 上部分要用的 */

.navigation {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    background: #fff;
    transition: all ease .4s;
    transform: scale(0);
    opacity: 0;
}

.navigation .content {
    margin: 0 auto;
    width: 90%;
    display: flex;
    justify-content: space-around;
    align-items: center;

}

.navigation .content div {
    display: flex;
    justify-content: space-around;
    width: 15%;
    height: 13rem;
    text-align: center;
    align-items: center;
}

.navigation .content div a {
    width: 100%;
}

.navigation .content div a img {
    width: 50%;
}

.navigation .content div:nth-child(5) {
    display: flex;
    justify-content: space-around;
    width: 30%;
    height: 13rem;
    text-align: right;
    align-items: center;
}

.navigation .content div:nth-child(5) a {
    width: 100%;
}

.navigation .content div:nth-child(5) a img {
    width: 20%;
}